<template>
	<!-- 学术论文详情页 -->
	<div id="academicdetail" class="academicdetail">
		<Header></Header>
		<!--本来应该是导航，（方便全局替换）-->
		<!--<HHeader></HHeader> -->
		<div class="academicdetailCont">
			<div class="academicdetailCont_crumbs">
				<span>
					<router-link :to="{name:'home'}">首页</router-link>
				</span>
				<i class="iconfont icon-youjiantou"></i>
				<span>
					<router-link :to="{name:'academic'}">行业政策</router-link>
				</span>
				<i class="iconfont icon-youjiantou"></i>
				<span>正文</span>
			</div>
			<div class="academicdetailCont_cluster">
				<div class="academicdetailCont_cluster_Left">
					<div class="acad_cluster_left_title">
						<span>{{academicdetailB.Title}}</span>
					</div>
					<!-- <div class="acad_cluster_left_info_mocreate">
						<span>{{this.academicdetailB.AddDate}}</span>
					</div> -->
					<div class="acad_cluster_left_info">
						<span v-html="academicdetailB.Author"></span>
						<span style="text-align: right;">{{academicdetailB.AddDate}}</span>
					</div>
					<div class="acad_cluster_left_contB">
						<ul>

							<!-- <li
                style="float:right;cursor:pointer;"
                @click="like(academicdetailB,academicdetailB.ContentID)"
              >
                <i
                  :class="isShow ? 'iconfont icon-xingxing3 cont':'iconfont icon-xingxing3'"
                  style="position: relative;font-size: 24px;left: 15px;top: 1px;"
                ></i>
                <span style="position: relative;left: 27px;font-size: 15px;top:-1px;">收藏</span>
              </li> -->
							<li style="float:right;cursor:pointer;"
								@click="like(academicdetailB,academicdetailB.ContentID)">
								<van-icon name="star" class="ft24" :color="isShow ? '#ff7301' : null" />
								<span style="position: relative;left: 27px;font-size: 15px;top:-1px;">收藏</span>
							</li>
						</ul>
					</div>
					<div class="acad_cluster_left_cont">
						<ul v-show="academicdetailCont===0">
							<li>
								<!-- <p class="acad_cont_label">摘要</p> -->
								<p class="acad_cont_cont" v-html="academicdetailB.Content"></p>
								<!-- <p class="acad_cont_type" v-if="academicdetailB.Keywords != ''">
									<span class="acad_cont_type_key">关键词：</span>
									<span class="acad_cont_typeKEY"
										v-for="(itemc,index) in (academicdetailB.Keywords || '').split(';')"
										:key="index">{{itemc}}</span>
								</p> -->


							</li>
						</ul>
					</div>
				</div>
				<div class="academicdetailCont_cluster_Right">
					<JusTinTime></JusTinTime>
					<div class="just_cluster_righ_img">
						<img src="../../../static/syimg/xxg_10.png" />
					</div>
				</div>
				<div style="clear:both"></div>
			</div>
		</div>
		<Alerts :flag='flag' @comfig='comfig' ></Alerts>
	</div>
</template>

<script>
	// import router from "@/router/index";
	//juqery

	export default {
		name: "academicdetail",
		data() {
			return {
				// 暂时可用不可删除
				downUrl: "",

				// 测试网
				LmurlCS: "http://syxnf.yywkt.com/Admin",
				academicdetailB: [],
				isShow: false,
				academicdetailCont: 0,
				src: "https://uniappfile.yywkt.com/UploadFile/Issue/xhbcjw04.pdf",
				flag:false
			};
		},
		components: {},
		methods: {
			comfig(type) {
				this.flag = false;
				if (type) {
					this.$uniRouter.push({
						path: "/login",
					});
				}
			},
			// 点击收藏
			// 类型 论文-paper 视频-video 课件-CouresWare
			like(item, id) {
				let userName = this.$sessionStorage.getItem("userName");
				if (userName) {
					if (this.isShow == false) {
						this.$httphelper
							// 加密完成
							.post("/api/LmDownLoadApi/AddCollectRecord", {
								Sign: "",
								Type: "paper",
								PId: this.$route.query.id,
								AuthorId: this.$localStorage.getItem("AuthorId")
							})
							.then(res => {
								if (res.data.data == true) {
									this.isShow = true;
									this.$message({
										type: "success",
										message: "添加成功，请到个人中心查看!"
									});
								} else {
									this.$message({
										type: "warning",
										message: "添加失败!"
									});
								}
							})
							.catch(err => {
								console.log("请求失败：" + "err");
							});
					} else if (this.isShow) {
						// 加密完成
						this.$nextTick(function(){
							this.isShow = false;
						})
						this.$httphelper
							.post("/api/LmDownLoadApi/DeleteCollectRecord", {
								Type: "paper",
								PId: this.$route.query.id,
								AuthorId: this.$localStorage.getItem("AuthorId")
							})
							.then(res => {
								if (res.data.data == true) {
									this.$message({
										
										type: "success",
										message: "取消收藏成功!"
									});
								} else {
									this.$message({
										type: "warning",
										message: "取消失败!"
									});
								}
							})
							.catch(err => {
								console.log("请求失败：" + "err");
							});
					}
				} else {
					this.flag = true
					// this.$confirm("请先登录", "提示", {
					//   customClass: "message-logout",
					//   confirmButtonText: "确定",
					//   cancelButtonText: "取消"
					// })
					//   .then(() => {
					//     this.$router.push({
					//       path: "/login"
					//     });
					//   })
					//   .catch(e => {
					//     console.log(e);
					//   });
				}
			},
			getData() {
				// 获取详情信息
				// 加密完成
				this.$httphelper
					.post("/api/NavigationApi/GetSiteContentAtt", {
						JournalID: 2020,
						ContentId: this.$route.query.id,
						AuthorId: this.$localStorage.getItem("AuthorId")
					})
					.then(res => {
						this.academicdetailB = res.data.data;
						this.academicdetailB.AddDate = this.academicdetailB.AddDate.substr(
							0,
							10
						);
						if (this.academicdetailB.IsCollect == 1) {
							this.isShow = true;
						} else if (this.academicdetailB.IsCollect == 0) {
							this.isShow = false;
						}
					})
					.catch(e => {
						console.log(e);
					});
			},
			// 下载pdf需消费学米
			// 加密完成
			handleDownTemplate(item) {
				this.$httphelper
					.post("/api/LmDownLoadApi/DownLoadPaperPdf", {
						Condition: 2,
						OpenId: this.$route.query.id,
						AuthorId: this.$localStorage.getItem("AuthorId")
					})
					.then(res => {
						if (res.data.data.State == 1) {
							let url = res.data.data.Path;

							window.open(url);
						} else {
							this.$message({
								message: "该文章没有pdf",
								type: "warning"
							});
						}
					})
					.catch(err => {
						console.log("请求失败：" + "err");
					});

				// 论文下载是否消费学米--不可删除
				// let userName = sessionStorage.getItem('userName');
				// if(userName){
				//   this.$httphelper.post('/api/LmDownLoadApi/DownLoadRecord',
				//   {
				//     Sign: "string",
				//     Type: "paper",
				//     PId: this.$route.query.id,
				//     AuthorId: localStorage.getItem('AuthorId')
				//   }).then((res) => {
				//     if(res.data.data.State == 1){
				//       this.downUrl = res.data.data.Path
				//       let url = this.LmurlCS + this.downUrl;
				//       util.download(url)
				//     } else if(res.data.data.State == 2){
				//       this.$message({
				//         type: 'warning',
				//         message: '您的学米不足，请前往充值!'
				//       });
				//     } else if(res.data.data.State == 3){
				//       this.$message({
				//         type: 'warning',
				//         message: '该文件不存在!'
				//       });
				//     }
				//   }).catch((e) => {
				//     console.log(e);
				//   })
				// } else {
				//   this.$confirm('请先登录', '提示', {
				//     confirmButtonText: '确定',
				//     cancelButtonText: '取消',
				//     // type: 'warning'
				//   }).then(() => {
				//     this.$router.push({
				//       path:'/login',
				//     })
				//   }).catch((e) => {
				//     console.log(e);
				//   });
				// }
				// let url = this.LmurlCS + '/api/Common/DownLoad?file=' + this.downUrl ;
				// let url = this.downUrl ;
				// console.log(url);
				// util.download(url)
			},

			// 查看pdf，不消耗学米
			toMenu() {
				this.$router.push({
					path: '/academic/academicdetail',
				})
				// Condition 1 是查看  2  是 下载
				// this.$httphelper
				//   .post("/api/LmDownLoadApi/DownLoadPaperPdf", {
				//     Condition: 1,
				//     OpenId: this.$route.query.id,
				//     AuthorId: localStorage.getItem("AuthorId")
				//   })
				//   .then(res => {
				//     console.log(res,"sssssssssss")
				//     if (res.data.data.State == 1) {
				//       window.open(res.data.data.Path);
				//     } else {
				//       this.$message({
				//         message: "该文章没有pdf",
				//         type: "warning"
				//       });
				//     }
				//   })
				//   .catch(err => {
				//     console.log("请求失败：" + "err");
				//   });
			}
		},
		created() {
			this.getData();
		},
		watch: {
			//监听相同路由下参数变化的时候，从而实现异步刷新
			$route(to, from) {
				//做一些路由变化的响应
				//打开加载动画
				this.loading = true;
				//重新获取数据
				this.getData();
				/** 初始化其他数据 */
				// let pid = this.$route.query.id;
				// if(pid){
				//   this.initOther(id);
				// }
			}
		}
	};
</script>


<style lang="less" scoped>
	#academicdetail {
		width: 100%;

		.academicdetailCont {
			width: 100%;
			height: 100%;
			display: inline-block;

			.academicdetailCont_crumbs {
				height: 40rpx;
				margin: 0 auto;
				position: relative;
				margin-top: 56rpx;
				text-align: left;
				line-height: 40rpx;
				padding-left: 20rpx;

				span:nth-child(1) a,
				span:nth-child(3) a {
					color: #000000;
					font-size: 32rpx;
					font-weight: bold;
					cursor: pointer;
				}

				i {
					color: #767c82;
					font-size: 36rpx;
					margin-left: 20rpx;
					font-weight: bold;
				}

				span:nth-child(5) {
					color: #003c80;
					font-size: 32rpx;
					margin-left: 20rpx;
					font-weight: bold;
					cursor: pointer;
				}
			}

			.academicdetailCont_cluster {
				height: 100%;
				margin: 0 auto;
				margin-top: 56rpx;

				.academicdetailCont_cluster_Left {
					height: auto;
					position: relative;
					float: left;

					.acad_cluster_left_title {
						width: 100%;
						height: 40rpx;
						line-height: 40rpx;

						span:nth-child(1) {
							float: left;
							font-size: 36rpx;
							color: #000;
							font-weight: bold;

							// overflow: hidden;
							// text-overflow: ellipsis;
							// display: -webkit-box;
							// -webkit-line-clamp: 1;
							// line-clamp: 1;
							// /* autoprefixer: off */
							// -webkit-box-orient: vertical;
							/* autoprefixer: on */
							em {
								font-style: normal;
								float: right;
								color: #909090;
								font-size: 32rpx;
								position: absolute;
								right: 0;
							}
						}

						span:nth-child(2) {
							float: right;
							color: #909090;
							font-size: 32rpx;
						}
					}

					.acad_cluster_left_info {
						margin-top: 36rpx;
						width: 100%;
						line-height: 36rpx;
						display: flex;

						span:nth-child(1) {
							display: inline-block;
							height: 100%;
							width: 64%;
						}

						span {
							color: #8b8b8b;
							font-size: 28rpx;
							letter-spacing: 0px;
							word-spacing: 26rpx;
							line-height: 56rpx;

							/deep/a {
								color: #8b8b8b !important;
							}
						}
					}

					.acad_cluster_left_contB {
						width: 100%;
						margin-top: 30rpx;
						position: relative;

						ul:nth-child(1) {
							width: 100%;
							height: 64rpx;
							position: relative;

							.academicdetailCont {
								background: #003c80;

								a {
									color: #fff !important;
								}
							}

							i {
								font-style: normal;
								font-size: 32rpx;
								position: absolute;
								top: 8rpx;
							}

							i:nth-child(2) {
								left: 12%;
							}

							i:nth-child(4) {
								left: 27%;
							}

							i:nth-child(6) {
								left: 41%;
							}

							li {
								list-style: none;
								float: left;
								width: 184rpx;
								height: 64rpx;
								line-height: 64rpx;
								text-align: center;
								margin-right: 60rpx;

								a {
									color: #000000;
									font-size: 32rpx;
								}
							}
						}
					}

					.acad_cluster_left_cont {
						overflow: hidden;
						overflow-y: auto;
						width: 100%;
						height: auto;

						ul:nth-child(1) {
							width: 100%;
							position: relative;

							.academicdetailCont {
								background: #003c80;

								a {
									color: #fff !important;
								}
							}

							i {
								font-style: normal;
								font-size: 32rpx;
								position: absolute;
								color: #eee;
								top: 8rpx;
							}

							i:nth-child(2) {
								left: 12%;
							}

							li {
								list-style: none;
								width: 184rpx;
								height: 64rpx;
								line-height: 64rpx;
								text-align: center;
								margin-right: 60rpx;

								a {
									color: #000000;
									font-size: 32rpx;
								}
							}
						}

						ul:nth-child(1) {
							width: 100%;
							position: relative;

							li {
								list-style: none;
								width: 100%;
								height: auto;
								float: left;
								cursor: pointer;
								padding: 30rpx 18rpx;
								box-sizing: border-box;
								background: #fff;

								.acad_cont_label {
									color: #000000;
									font-size: 32rpx;
									font-weight: bold;
									text-align: left;
								}

								.acad_cont_labelB {
									margin-top: 22rpx;
								}

								.acad_cont_cont {
									margin-top: 20rpx;
									color: #000000;
									font-size: 32rpx;
									line-height: 60rpx;
									letter-spacing: 2rpx;
									text-align: justify;
								}

								.acad_cont_type {
									margin-top: 30rpx;
									width: 100%;
									height: 138rpx;

									.acad_cont_type_key {
										color: #000000;
										font-size: 32rpx;
										float: left;
									}

									.acad_cont_typeKEY {
										// float: left;
										padding: 0 20rpx;
										color: #000;
										font-size: 30rpx;
										text-align: center;
										border-radius: 10rpx;
										// margin-left: 15px;
										line-height: 44rpx;
										margin-bottom: 24rpx;
										margin-top: 10rpx;
									}
								}

								.acad_cont_select {
									margin-top: 132rpx;
									width: 100%;
									height: 60rpx;

									span {
										float: right;
										width: 188rpx;
										height: 60rpx;
										border-radius: 10rpx;
										border: 2rpx solid #c0c0c0;
										color: #c0c0c0;
										font-size: 28rpx;
										line-height: 60rpx;
										text-align: center;
										margin-left: 60px;
									}

									span:nth-child(2) {
										background: #003c80;
										color: #fff;
									}

									span:hover {
										background: #003c80;
										color: #fff;
									}
								}
							}
						}

						ul:nth-child(2) {
							width: 100%;
							margin-top: 30rpx;
							position: relative;

							li {
								width: 100%;
								height: auto;
								line-height: 80rpx;
								list-style: none;
								position: relative;

								.titText {
									display: inline-block;
									font-size: 34rpx;
									width: 22%;
									font-weight: bold;
									text-align: left;
									position: absolute;
								}

								.conText {
									display: inline-block;
									width: 60%;
									height: auto;
									text-align: left;
									font-size: 34rpx;
									position: relative;
									left: 25%;
								}
							}
						}
					}
				}

				.academicdetailCont_cluster_Right {
					width: 530rpx;
					float: right;
					border-left: 2rpx solid #eeeeee;
					position: relative;

					.just_cluster_righ_img {
						margin-left: 38rpx;
						margin-top: 56rpx;
						width: 500rpx;
						height: 326rpx;

						img {
							width: 100%;
							height: 100%;
						}
					}
				}
			}
		}
	}

	.cont {
		color: #003c80 !important;
	}

	.el-row {
		margin-bottom: 40rpx;

		&:last-child {
			margin-bottom: 0;
		}
	}

	.grid-content {
		border-radius: 8rpx;
		min-height: 64rpx;
		line-height: 64rpx;
	}

	.row-bg {
		padding: 20rpx 0;
		background-color: #f9fafc;
	}

	/deep/.el-col-3 {
		width: 12.5%;
		text-align: left;
	}

	/deep/.el-col-21 {
		width: 87.5%;
	}

	@media screen and (min-width: 1010px) {
		.acad_cluster_left_info_mocreate {
			display: none !important;
		}
	}

	@media screen and (max-width: 1010px) {
		.academicdetailCont_cluster_Right {
			display: none;
		}

		.moPDF {
			background: #c0c0c0;
			color: #fff !important;
		}

		.moDownLoad {
			background: #003c80;
			color: #fff !important;
		}

		.acad_cluster_left_title {
			height: auto !important;

			span {
				float: none !important;
			}
		}

		// .acad_cluster_left_info_webcreate {
		// 	display: none !important;
		// }

		.acad_cluster_left_info_mocreate {
			height: auto !important;
			margin-top: 20rpx !important;
			line-height: 46rpx !important;

			span {
				color: #8b8b8b;
				font-size: 28rpx;
				letter-spacing: 0px;
				word-spacing: 26rpx;
			}
		}

		.titText {
			width: 37% !important;
		}

		.conText {
			left: 43% !important;
		}

		.academicdetailCont_crumbs {
			display: none;
		}

		.academicdetailCont {
			.academicdetailCont_cluster {
				width: 94% !important;

				// margin-top: 112rpx !important;
				.academicdetailCont_cluster_Left {
					width: 100% !important;

					.acad_cluster_left_title {
						line-height: 60rpx !important;
						text-align: justify;
					}

					.acad_cluster_left_info {
						height: auto !important;
						margin-top: 20rpx !important;
						line-height: 46rpx !important;

						span {
							margin-top: 10rpx;
							width: 100%;
						}

						span:nth-child(1) {
							display: inline-block;
							height: 100%;
							width: 100% !important;
							font-size: 30rpx;
						}
					}

					.acad_cluster_left_cont {
						margin-top: 0 !important;
						margin-bottom: 190rpx !important;
					}
				}
			}
		}

		.acad_cont_type {
			height: 206rpx !important;

			.acad_cont_typeKEY {
				// width: 71%;
				line-height: 60rpx !important;
				margin-bottom: 20rpx !important;
				font-size: 32rpx !important;
				// margin-left: 80px !important;
			}
		}

		.acad_cont_select {
			span {
				width: 45% !important;
				margin-left: 0px !important;
			}

			span:nth-child(1) {
				margin-left: 64rpx !important;
			}
		}
	}
</style>
<style>
	@media screen and (max-width: 1010px) {
		.message-logout {
			width: 80% !important;
		}
	}
</style>